<template>
  <div class="app-container home">
    <div class="left-container">
      <Tree
        :treeDataList="treeDataList"
        :treeLoading="treeLoading"
        @nodeClick="nodeClick"
        :dKey="dKey"
        :type="2"
      />
    </div>
    <div class="right-container">
      <div class="right-container-top right-container-bg">
        <div class="right-container-top-table">
          <div class="right-container-top-left-table">
            <div class="table-title">测试条件配置</div>
            <el-table
              ref="multipleTable"
              border
              :data="testConditionConfigList"
              style="width: 100%; margin-top: 10px"
              :header-cell-style="getTableHeaderStyle"
              :cell-style="getTableCellStyle"
            >
              <template v-if="testConditionConfigColumn">
                <el-table-column v-for="(item,i) in Object.keys(testConditionConfigColumn)" :key="i"
                                 :prop="item"
                                 :label="testConditionConfigColumn[item]"
                                 header-align="center"
                >
                </el-table-column>
              </template>
              <template v-else>
                <el-table-column prop="" label="" header-align="center">
                </el-table-column>
              </template>

              <el-table-column width="60" label="操作" align="center">
                <template slot-scope="scope,row">
                  <el-link type="primary" icon="el-icon-search" :underline="false"
                           @click="selectTestConditionConfigParam(scope.row.rowguid)"></el-link>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div class="right-container-top-right-table">
            <div class="table-title">可靠性指标</div>
            <el-table
              ref="multipleTable"
              border
              :data="reliabilityIndicatorsList"
              style="width: 100%; margin-top: 10px"
              :header-cell-style="getTableHeaderStyle"
              :cell-style="getTableCellStyle"
            >
              <el-table-column
                prop="confidenceLevel"
                label="置信率"
                header-align="center"
              >
              </el-table-column>
              <el-table-column
                prop="survivalRate"
                label="存活率"
                header-align="center"
              >
              </el-table-column>
              <el-table-column
                prop="evaluationMethodName"
                label="评估方法"
                header-align="center"
                :show-overflow-tooltip="true"
              >
              </el-table-column>
              <el-table-column width="60" label="操作" align="center">
                <template slot-scope="scope">
                  <el-link type="primary" icon="el-icon-search" :underline="false"
                           @click="selectReliabilityIndicatorsSource(scope.row.rowguid)"></el-link>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>

        <div class="right-container-top-option">
          <div class="option-input">
            <div class="option-input-text" v-show="fatigueLifeShow">疲劳寿命：</div>
            <div style="float: left;width: 260px;height: 30px;margin-right: 30px" v-show="fatigueLifeShow">
              <el-select
                placeholder="请选择"
                v-model="selectFatigueLife"
              >
                <el-option
                  v-for="item in fatigueLifeOptions"
                  :key="JSON.stringify(item)"
                  :label="item.label"
                  :value="JSON.stringify(item)">
                </el-option>
              </el-select>
            </div>
            <div class="option-input-text" v-show="fatigueLifeShow">P-S-N方法：</div>
            <div style="float: left;width: 260px;height: 30px;margin-right: 30px" v-show="fatigueLifeShow">
              <el-select
                placeholder="请选择"
                v-model="selectPSNWay"
              >
                <el-option
                  v-for="item in Object.keys(PSNWayOptions)"
                  :key="item"
                  :label="Object.keys(PSNWayOptions[item])[0]"
                  :value="item">
                </el-option>

              </el-select>
            </div>

            <div class="option-input-text" v-show="fatigueStrengthShow">疲劳强度：</div>
            <div style="float: left;width: 260px;height: 30px;margin-right: 30px" v-show="fatigueStrengthShow">
              <el-select
                placeholder="请选择"
                v-model="selectProbabilityFatigueStrength"
              >

              <!-- :label="item[Object.keys(item)[0]]+' - '+ item.yingl" -->
                <el-option
                  v-for="item in probabilityFatigueStrengthOptions"
                  :key="JSON.stringify(item)"
                  :value="JSON.stringify(item)"
                  :label="item.label">
                  <!-- <span v-for="(item1, index) in Object.keys(item)">
                    <span v-if="index < Object.keys(item).length-1">
                    {{item[item1] +' - '}}
                    </span>
                    <span v-else>
                    {{item[item1] }}
                    </span>
                  </span> -->
                </el-option>
              </el-select>
            </div>
            <div class="option-input-text" v-show="fatigueStrengthShow">概率疲劳强度方法：</div>
            <div style="float: left;width: 260px;height: 30px;margin-right: 30px" v-show="fatigueStrengthShow">
              <el-select
                placeholder="请选择"
                v-model="selectFatigueStrength"
              >
                <el-option
                  v-for="item in fatigueStrengthOptions"
                  :key="JSON.stringify(item)"
                  :label="Object.keys(item)[0]"
                  :value="item[Object.keys(item)[0]]">
                </el-option>
              </el-select>
            </div>
          </div>

          <div class="option-buttons">
            <el-button
              type="primary"
              class="buttons buttons-files"
              icon="el-icon-search"
              style="margin-left: 38px;"
              @click="queryList"
            >查询
            </el-button
            >
          </div>
        </div>
      </div>
      <div class="right-container-bottom right-container-bg">
        <div class="table-title">查询结果</div>
        <el-table
          ref="multipleTable"
          border
          :data="resultDataList"
          style="width: 100%; margin-top: 10px"
          :height="heightTestData"
          @selection-change="handleSelectionChange"
          :header-cell-style="getTableHeaderStyle"
          :cell-style="getTableCellStyle"
          v-loading="dataListLoading"
          >
          <el-table-column
            type="selection"
            align="center"
            fixed
            width="55">
          </el-table-column>
          <template v-if="resultDataColList">
            <el-table-column v-for="(item,i) in Object.keys(resultDataColList)" :key="i"
                             :prop="item"
                             fixed
                             :label="resultDataColList[item]"
                             :show-overflow-tooltip="true"
                             header-align="center"
            >
              <template slot="header" slot-scope="scope">
                <el-tooltip :content="resultDataColList[item]" placement="top" effect="light">
                  <el-checkbox v-model="resultDataColListSelect[i]" @change="resultDataColListChange(item, i)" class="checkboxTitle" v-if="!filterFixedTitles(item)">
                    <span>{{resultDataColList[item]}}</span>
                  </el-checkbox>
                  <span v-else>{{resultDataColList[item]}}</span>
                </el-tooltip>
              </template>
              <template slot-scope="scope">
                <div v-if="filterFixedTitles(item)">{{scope.row[item]}}</div>
                <div v-else>
                  <el-input size="mini" v-model="scope.row[item]" @change="modifyDataList(scope.row)"
                            placeholder="请输入"></el-input>
                </div>
              </template>
            </el-table-column>
          </template>
          <template v-else>
            <el-table-column prop="" label="" header-align="center">
            </el-table-column>
          </template>
        </el-table>
        <div style="display: flex; justify-content: center; margin-top: 20px">
          <div class="bottom-button">
            <el-button type="primary" style="width: 100px"
                       @click="saveDataList"
            >
              <svg-icon icon-class="save"/>
              保存
            </el-button>
            <el-button
              type="primary"
              style="margin-left: 38px; width: 100px"
              @click="echartsBarBtn"
            >
              <svg-icon icon-class="column-chart"/>
              柱图
            </el-button>
            <el-button
              type="primary"
              style="margin-left: 38px; width: 100px"
              @click="echartsRaddarBtn"
            >
              <svg-icon icon-class="radar-chart"/>
              雷达图
            </el-button>
            <el-button
              type="primary"
              style="margin-left: 38px; width: 100px"
              @click="echartsLineBtn"
              v-if="treelabel =='疲劳裂纹扩展速率' || treelabel =='疲劳寿命'"
            >
              <svg-icon icon-class="line"/>
              线图
            </el-button>
            <el-button
              type="primary"
              style="margin-left: 38px; width: 100px"
              @click="echartsLineBtn2"
              v-if="treelabel =='静力学性能'"
            >
              <svg-icon icon-class="line"/>
              线图
            </el-button>
          </div>
        </div>
      </div>
    </div>
    <el-dialog title="测试条件配置" :visible.sync="dialogTestConditionConfigListModel" width="800px">
      <el-table
        ref="multipleTable"
        border
        :data="dialogTestConditionConfigList"
        style="width: 100%; margin-top: 10px"
        :header-cell-style="getTableHeaderStyle"
        :cell-style="getTableCellStyle"
      >
        <template v-if="testConditionConfigColumn">
          <el-table-column v-for="(item,i) in Object.keys(testConditionConfigColumn)" :key="i"
                           :prop="item"
                           :label="testConditionConfigColumn[item]"
                           header-align="center"
          >
          </el-table-column>
        </template>
        <template v-else>
          <el-table-column prop="" label="" header-align="center">
          </el-table-column>
        </template>
        <el-table-column width="80" label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="primary" size="mini"
                       :disabled="scope.row.rowguid === dialogTestConditionConfigListActive"
                       @click="dialogtestConditionConfigListSelect(scope.row)"
            >
              选择
            </el-button>
            <!--            <el-checkbox :checked="scope.row.rowguid === dialogTestConditionConfigListActive" @change="tableTestParamCheck(scope.$index,$event)"></el-checkbox>-->
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
<!--    <el-button @click="dialogTestConditionConfigListModel = false">关 闭</el-button>-->
        <!--    <el-button type="primary" @click="dialogChangetestConditionConfigList">选择</el-button>-->
  </span>
    </el-dialog>
    <el-dialog title="可靠性指标" :visible.sync="dialogReliabilityIndicatorsListModel" width="800px">
      <el-table
        ref="multiple-table"
        border
        :data="dialogReliabilityIndicatorsList"
        style="width: 100%; margin-top: 10px"
        :header-cell-style="getTableHeaderStyle"
        :cell-style="getTableCellStyle"
      >
        <el-table-column
          prop="confidenceLevel"
          label="置信率"
          header-align="center"
        >
        </el-table-column>
        <el-table-column
          prop="survivalRate"
          label="存活率"
          header-align="center"
        >
        </el-table-column>
        <el-table-column
          prop="evaluationMethodName"
          label="评估方法"
          header-align="center"
        >
        </el-table-column>
        <el-table-column width="80" label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="primary" size="mini"
                       :disabled="scope.row.rowguid === dialogReliabilityIndicatorsListActive"
                       @click="dialogDataSourceListSelect(scope.row)">选择
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
    <el-dialog title="" :visible.sync="dialogBarEchartsModel" width="1200px" @open="handleOpenbar">
      <bar-chart :chartData="chartDataList" ref="barchart"/>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
    <el-dialog title="" :visible.sync="dialogRaddarEchartsModel" width="1200px" @open="handleOpenRaddar">
      <raddar-chart :chartData="chartDataList" ref="raddarchart"/>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
    <el-dialog title="" :visible.sync="dialogLineEchartsModel" width="1200px" @open="handleOpenSn">
      <!-- <line-chart :chartData="chartDataList"/> -->
      <sn-chart :chartData="loglineChartData"  ref="snchart"/>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
    <el-dialog title="" :visible.sync="dialogLineEchartsModel2" width="1200px" @open="handleOpenSn2">
      <!-- <line-chart :chartData="chartDataList"/> -->
      <sn-chart2 :chartData="loglineChartData"  ref="snchart2"/>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
  </div>
</template>

<script>
  import service from "@/api/statistics";
  import Tree from "../../common/tree.vue";
  import BarChart from "./BarChart";
  import LineChart from "./lineChart";
  import RaddarChart from "./RaddarChart";
  import SnChart2 from "./snChart2";
  import SnChart from "./snChart";
  import { queryLineChartData} from "@/api/business/datachart";


  export default {
    name: "Dataechart",
    components: {
      RaddarChart,
      LineChart,
      BarChart,
      Tree,
      SnChart,
      SnChart2
    },
    data() {
      return {
        treeDataList: [],
        treeLoading: false,
        testConditionConfigColumn: {}, // 测试条件配置表头字段
        testConditionConfigList: [], // 测试条件配置数据
        reliabilityIndicatorsList: [], // 可靠性指标
        resultDataColList: {}, // 结果列表表头字段
        resultDataList: [], // 结果列表列表
        setResultDataList: [], // 修改 结果列表列表
        // 下拉列表
        fatigueLifeShow: false, // 疲劳寿命 显隐
        fatigueLifeOptions: [], // 疲劳寿命下拉
        selectFatigueLife: null, // 疲劳寿命下拉 选中
        PSNWayOptions: [], // P-S-N方法下拉
        selectPSNWay: null, // P-S-N方法下拉 选中

        fatigueStrengthShow: false, // 疲劳强度 显隐
        fatigueStrengthOptions: [], // 疲劳强度下拉
        selectFatigueStrength: null, // 疲劳强度 选中
        probabilityFatigueStrengthOptions: [], // 概率疲劳强度方法下拉
        selectProbabilityFatigueStrength: null, // 概率疲劳强度方法 选中

        resultDataCollFixed: ['materialtypename', 'shop_name', 'manufacturer', 'technology', 'description'], // 结果列表表头固定字段
        resultDataColListSelect: [], // 结果表格表头选中
        resultDataColListSelectLabel: [], // 结果表格表头选中
        multipleSelection:[],// 结果表格选中

        dKey: [],
        // 测试参数列表请求ID
        testConditionConfigRequestID: {},

        // 弹出层
        dialogTestConditionConfigListModel: false, // 测试条件配置列表 弹出层
        dialogTestConditionConfigList: [], // 测试条件配置数据列表
        dialogTestConditionConfigListActive: null, // 测试条件配置数据选中
        dialogReliabilityIndicatorsListModel: false, // 可靠性指标列表 弹出层
        dialogReliabilityIndicatorsList: [], // 可靠性指标数据列表
        dialogReliabilityIndicatorsListActive: null, // 可靠性指标数据选中
        dialogBarEchartsModel: false, //
        chartDataList: {}, // 图表数据
        dialogLineEchartsModel: false, // 图表数据
        dialogLineEchartsModel2: false, // 图表数据
        dialogRaddarEchartsModel: false, // 图表数据
        treelabel : "",
        paramData : {},
        loglineChartData: {},
        heightTestData: '',
        dataListLoading: false,
        saveflag: true
      };
    },

    created() {
      // this.$store.dispatch('settings/changeSetting', {
      //   key: 'theme',
      //   value: '#409EFF'
      // })
      this.getListTree();
      // // 获取下拉
      // this.getPsnMethodDataList()
      // this.getFatigueStrengthOptionsList()
    },
    mounted() {
      this.$nextTick(()=>{
        this.heightTestData = window.innerHeight - 390
      })
    },
    methods: {
      // 查询树形结构数据
      getListTree() {
        this.treeLoading = true;
        service.listTree().then((res) => {
          let p = [
            {
              id: "00001",
              label: "模块",
              children: res.data
            }
          ]
          this.treeDataList = p
          this.dKey = [res.data[0].id];
          this.fatigueLifeShow = false
          this.fatigueStrengthShow = false
          this.treelabel = res.data[0].children[0]
          if(res.data[0].children[0].label === '疲劳寿命'){
            this.fatigueLifeShow = true
          }
          if(res.data[0].children[0].label === '疲劳强度'){
            this.fatigueStrengthShow = true
          }
          let param = {
            performanceTypeId: res.data[0].id
          }
          this.dataListLoading = true
          this.getDataList(param);
        }).catch((e) => {
        }).finally(() => {
          this.treeLoading = false;
        });
      },
      // 点击树形节点
      nodeClick(params) {
        let param = {
          performanceTypeId: params.node,
        }
        this.fatigueLifeShow = false
        this.fatigueStrengthShow = false
        this.treelabel = params.label
        if(params.label === '疲劳寿命'){
          this.fatigueLifeShow = true
          this.selectFatigueLife = null // 疲劳寿命下拉 选中
          this.selectPSNWay = null // P-S-N方法下拉 选中
        }
        if(params.label === '疲劳强度'){
          this.fatigueStrengthShow = true
          this.selectFatigueStrength= null // 疲劳强度 选中
          this.selectProbabilityFatigueStrength= null // 概率疲劳强度方法 选中
        }
        this.testConditionConfigRequestID = param
        this.dataListLoading = true
        this.getDataList(param)
      },
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      // 设置表头样式
      getTableHeaderStyle() {
        return {
          background: "#EBF4FE",
          fontSize: "14px",
          fontWeight: "400",
          color: "#333333",
          padding: "3px 0",
          height: "30px"
        };
      },
      // 设置表格样式
      getTableCellStyle() {
        return {
          fontSize: "14px",
          textAlign: 'center',
          padding: "3px 0"
        };
      },
      // 获取测试数据参数数据
      getDataList(params) {
        this.testConditionConfigColumn = {}
        this.resultDataColList = {}
        this.paramData = {}
        this.resultDataList=[]
        console.log(params)
        service.pageInitData(params).then((res) => {
          this.testConditionConfigColumn = res.data.paramDataColList[0];
          this.testConditionConfigList = res.data.resultParamDataList;
          this.reliabilityIndicatorsList = res.data.reliabilityindexList;
          // this.resultDataList = res.data.selConditonDataList;
          this.resultDataColList = res.data.resultDataColList[0];
          console.log(res, 888);
          if(res.data.reliabilityindexList!=null && res.data.reliabilityindexList.length>0){
            if(res.data.reliabilityindexList[0].evaluationMethod==1){
              res.data.reliabilityindexList[0].evaluationMethodName = "ISO单侧容限系数法"
            }
            if(res.data.reliabilityindexList[0].evaluationMethod==2){
              res.data.reliabilityindexList[0].evaluationMethodName = "IIW单侧容限系数法"
            }
            this.confidenceLevel = res.data.reliabilityindexList[0].confidenceLevel
            this.survivalRate = res.data.reliabilityindexList[0].survivalRate
            this.evaluationMethod = res.data.reliabilityindexList[0].evaluationMethod
          }
          if(res.data.resultParamDataList.length>0){
            this.paramGuid = res.data.resultParamDataList[0].rowguid
            Object.keys(res.data.resultParamDataList[0]).map((key,index)=>{
                if(key!="rowguid"){
                  this.paramData[key] = res.data.resultParamDataList[0][key]
                }
            });
            let param1 = {
              paramId: res.data.resultParamDataList[0].rowguid,
              performanceTypeId: params.performanceTypeId,
            }
            if(this.treelabel === '疲劳寿命'){
              //疲劳寿命
              this.getFatigueLifeSelectList(param1)
              //psn方法
              this.getPsnMethodDataList()
            }
            if(this.treelabel === '疲劳强度'){
              //疲劳强度
              this.getProbabilityFatigueStrengthOptionsList(param1)
              //概率疲劳强度方法
              this.getFatigueStrengthOptionsList()
            }
          }

        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        }).finally(() => {
          this.dataListLoading = false
          this.treeLoading = false;
        });
      },
      // 疲劳寿命下拉
      getFatigueLifeSelectList(params) {
        service.getSpecialComputeParamList(params).then((res) => {
          this.fatigueLifeOptions = res.data;
          this.fatigueLifeOptions.forEach(item => {
            let label = ""
            Object.keys(item).map((key,index)=>{
                  // console.log(key,item[key]);//key=>属性名    data[key]=>属性值
                if(index==Object.keys(item).length-1){
                  label += item[key]
                }else{
                  label += item[key]+"-"
                }
            });
            item['label'] = label
          })
        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        }).finally(() => {
          this.treeLoading = false;
        });
      },
      // P-S-N方法下拉
      getPsnMethodDataList() {
        service.getPsnMethodDataList().then((res) => {
          this.PSNWayOptions = res.data;
        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        }).finally(() => {
          this.treeLoading = false;
        });
      },
      // 概率疲劳强度方法下拉
      getFatigueStrengthOptionsList() {
        service.getStrengthMethodDataList().then((res) => {
          this.fatigueStrengthOptions = res.data;
        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        }).finally(() => {
          this.treeLoading = false;
        });
      },
      // 疲劳强度下拉
      getProbabilityFatigueStrengthOptionsList(params) {
        service.getSpecialComputeParamList(params).then((res) => {
          this.probabilityFatigueStrengthOptions = res.data;
          this.probabilityFatigueStrengthOptions.forEach(item => {
            let label = ""
            Object.keys(item).map((key,index)=>{
                  // console.log(key,item[key]);//key=>属性名    data[key]=>属性值
                if(index==Object.keys(item).length-1){
                  label += item[key]
                }else{
                  label += item[key]+"-"
                }
            });
            item['label'] = label
          })

        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        }).finally(() => {
          this.treeLoading = false;
        });
      },
      // 选中数据参数数据
      tableTestParamCheck(row, e) {
        console.log(row, e);
      },
      // 列表排序
      fileSortData(jsonArray) {
        jsonArray.sort(function (a, b) {
          return a.age - b.age; // 升序排序，如果你想降序排序，可以改为 b.age - a.age
        });
        return jsonArray
      },
      // 选中数据参数数据
      selectTestConditionConfigParam(row) {
        this.dialogTestConditionConfigListModel = true
        service.getParamListByMaterialID(this.testConditionConfigRequestID).then((res) => {
          this.dialogTestConditionConfigList = res.data
          this.dialogTestConditionConfigListActive = row
        })
      },
      // 弹出层 选择功能
      dialogtestConditionConfigListSelect(row) {
        this.testConditionConfigList = [row]
        this.dialogTestConditionConfigListModel = false
        let param1 = {
          paramId: row.rowguid,
          performanceTypeId: this.testConditionConfigRequestID.performanceTypeId,
        }
        this.paramGuid = row.rowguid
        Object.keys(row).map((key,index)=>{
            if(key!="rowguid"){
              this.paramData[key] = row[key]
            }
        });
        if(this.treelabel === '疲劳寿命'){
          //疲劳寿命
          this.getFatigueLifeSelectList(param1)
        }
        if(this.treelabel === '疲劳强度'){
          //疲劳强度
          this.getProbabilityFatigueStrengthOptionsList(param1)
        }
      },
      // 选中数据来源列表
      selectReliabilityIndicatorsSource(row) {
        this.dialogReliabilityIndicatorsListModel = true
        service.getReliabilityIndexList(this.testConditionConfigRequestID).then((res) => {
          res.data.forEach(item=>{
            if(item.evaluationMethod==1){
              item.evaluationMethodName = "ISO单侧容限系数法"
            }
            if(item.evaluationMethod==2){
              item.evaluationMethodName = "IIW单侧容限系数法"
            }
          })
          this.dialogReliabilityIndicatorsList = res.data
          this.dialogReliabilityIndicatorsListActive = row
        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        })
      },
      // 选择数据来源列表弹出层数据
      dialogDataSourceListSelect(row) {
        console.log(row)
        this.reliabilityIndicatorsList = [row]
        this.dialogReliabilityIndicatorsListModel = false
        this.confidenceLevel = row.confidenceLevel
        this.survivalRate = row.survivalRate
        this.evaluationMethod = row.evaluationMethod
      },
      // 查询结果
      queryList() {
        this.saveflag = true
        let param = {
          ...this.testConditionConfigRequestID,
          // paramGuid: this.paramGuid,
          confidencelevel: this.confidenceLevel,
          survivalrate: this.survivalRate,
          evaluationmethod: this.evaluationMethod
        }
        if(this.treelabel === '疲劳寿命'){
          let fatigueLife = {
            ...this.paramData
          }
          if(this.selectFatigueLife!=null){
            this.selectFatigueLife = JSON.parse(this.selectFatigueLife)
            Object.keys(this.selectFatigueLife).map((key,index)=>{
                  // console.log(key,item[key]);//key=>属性名    data[key]=>属性值
                if(key!="label"){
                  fatigueLife[key] = this.selectFatigueLife[key]
                }
            });
            console.log(fatigueLife)
            this.selectFatigueLife = JSON.stringify(this.selectFatigueLife)
          }else{
            this.$message({
              message: '请选择疲劳寿命条件',
              type: 'warning'
            });
            return false
          }
          if(this.selectPSNWay == null){
            this.$message({
              message: '请选择psn方法',
              type: 'warning'
            });
            return false
          }
          param.paramMap = JSON.stringify(fatigueLife)
          if(this.selectPSNWay!=null){
            param.psnmethod = Number(this.selectPSNWay)+1
          }
        }else if(this.treelabel === '疲劳强度'){
          let probability = {
            ...this.paramData
          }
          if(this.selectProbabilityFatigueStrength!=null){
            this.selectProbabilityFatigueStrength = JSON.parse(this.selectProbabilityFatigueStrength)
            Object.keys(this.selectProbabilityFatigueStrength).map((key,index)=>{
                  // console.log(key,item[key]);//key=>属性名    data[key]=>属性值
                if(key!="label"){
                  probability[key] = this.selectProbabilityFatigueStrength[key]
                }
            });
            this.selectProbabilityFatigueStrength = JSON.stringify(this.selectProbabilityFatigueStrength)
          }else{
            this.$message({
              message: '请选择疲劳强度条件',
              type: 'warning'
            });
            return false
          }
          if(this.selectFatigueStrength == null){
            this.$message({
              message: '请选择概率疲劳强度方法',
              type: 'warning'
            });
            return false
          }
          param.paramMap = JSON.stringify(probability)
          if(this.selectFatigueStrength!=null){
            param.flmethod = this.selectFatigueStrength
          }
        }else {
          let paramData1 = {
            ...this.paramData
          }
          param.paramMap = JSON.stringify(paramData1)
        }
        this.resultDataColListSelectLabel = []
        this.resultDataList = []
        service.queryResultDataList(param).then((res) => {
          // 清空列表中的选中数据
          if(res.data.length > 0){
            this.resultDataColListSelect = new Array( Object.keys(res.data[0]).length).fill(false);
            this.resultDataList = res.data
          }
        }).catch((e) => {
          this.$message({
            message: e,
            type: 'error'
          });
        })
      },
      // 过滤固定标题
      filterFixedTitles(val) {
        return this.resultDataCollFixed.some(el => el === val)
      },
      modifyDataList(row) {
        let newList = {...row}
        this.resultDataCollFixed.map(item=>{
          delete newList[item]
        })
        for(let key in newList){//这里的key是键，不是下标
        console.log(typeof(newList[key]))
            if(typeof(newList[key]) == "number"){
              if(isNaN(newList[key])){
                this.$modal.msgError(this.resultDataColList[key]+`不能为空!`);
                this.saveflag = false
                // 在这里抛出异常
                throw new Error('中断循环')
              }
            }else{
              if(newList[key] == null || newList[key] ==undefined || newList[key] ==""){
                this.$modal.msgError(this.resultDataColList[key]+`不能为空!`);
                this.saveflag = false
                // 在这里抛出异常
                throw new Error('中断循环')
              }
            }

        }
        this.setResultDataList.push(newList)
        this.saveflag = true
        console.log(this.setResultDataList)
      },
      saveDataList() {
        if(this.saveflag){
          let param = {
            ...this.testConditionConfigRequestID,
            resultDataMapList: JSON.stringify(this.setResultDataList),
          }
          service.saveComputeReusult(param).then(() => {
            this.$message({
              message: '保存成功',
              type: 'success'
            });
            this.queryList()
          }).catch(err=>{
            this.$message({
              message: err,
              type: 'error'
            });
          }).finally(()=>{
            this.setResultDataList = []
          })

        }else{
          this.$modal.msgError(`请补充空值!`);
        }

      },
      resultDataColListChange(name,i){
        if(this.resultDataColListSelect[i]){
          this.resultDataColListSelectLabel.push(name)
        }else {
          let newArray = this.resultDataColListSelectLabel.filter(it=>it !== name)
          this.resultDataColListSelectLabel = newArray
        }
      },
      // 处理查询表中数据
      handleTableData(){
        let newArray = []
        let newLabel= []
        let newLabelt= []
        this.resultDataColListSelectLabel.map( (itemLabel)=>{
          newLabel.push(this.resultDataColList[itemLabel])
        })
        this.multipleSelection.map(items => {
          newLabelt.push(items['shop_name']+"-"+items['manufacturer'])
        })
        this.multipleSelection.map(items => {
          let newList = []
          this.resultDataColListSelectLabel.map( (itemLabel)=>{
            newList.push(items[itemLabel])
          })
          newArray.push(newList)
        })
        let res = {
          legend: newLabelt,
          xdata: newLabel,
          ydata: newArray,
        }
        this.chartDataList = res
      },
      // 验证查询数据列表选择情况
      validateData(line, column){
        if(!(this.resultDataColListSelectLabel.length >= column.min && this.resultDataColListSelectLabel.length <= column.max )){
          this.$message({
            message: '请至少选择' + column.min + "列，并不超过"+column.max+'列数据',
            type: 'warning'
          });
          return false
        }else
        if(!(this.multipleSelection.length >= line.min && this.multipleSelection.length <= line.max) ){
          this.$message({
            message: '请至少选择' + line.min +"行，并不超过"+line.max+'行数据',
            type: 'warning'
          });
          return false
        }else {
          this.handleTableData()
          return true
        }
      },
      // 柱状图
      echartsBarBtn(){
        let line = {
          min: 2,
          max: 5,
        }
        let column = {
          min: 1,
          max: 1,
        }
        if(this.validateData(line,column)){
          this.dialogBarEchartsModel = true
        }
      },
      // 雷达图
      echartsRaddarBtn(){
        let line = {
          min: 2,
          max: 5,
        }
        let column = {
          min: 3,
          max: 5,
        }
        if(this.validateData(line,column)){
          this.dialogRaddarEchartsModel = true
        }
      },
      // 线图
      echartsLineBtn(){
        let line = {
          min: 1,
          max: 1,
        }
        let column = {
          min: 0,
          max: 100,
        }
        if(this.validateData(line,column)){
            let param = {
              ...this.testConditionConfigRequestID,
              performanceTypeName: this.treelabel
              // paramGuid: this.paramGuid,
              // confidencelevel: this.confidenceLevel,
              // survivalrate: this.survivalRate,
              // evaluationmethod: this.evaluationMethod
            }
            let paramMap1 = {
              params : this.paramData
            }
            let newList = Object.assign({}, this.multipleSelection[0]);
            this.resultDataCollFixed.map(item=>{
              if(item != "materialtypename"){
                delete newList[item]
              }
            })
            delete newList["rowguid"]
            let resultMap1 = {
              result : newList
            }
            let fatigueLife = {
              ...paramMap1,
              ...resultMap1
            }
            if(this.treelabel === '疲劳寿命'){
              if(this.selectFatigueLife!=null){
                this.selectFatigueLife = JSON.parse(this.selectFatigueLife)
                Object.keys(this.selectFatigueLife).map((key,index)=>{
                      // console.log(key,item[key]);//key=>属性名    data[key]=>属性值
                    if(key!="label"){
                      fatigueLife[key] = this.selectFatigueLife[key]
                    }
                });
                console.log(fatigueLife)
                this.selectFatigueLife = JSON.stringify(this.selectFatigueLife)
              }
              if(this.selectPSNWay!=null){
                fatigueLife.psnmethod = this.selectPSNWay
              }

              this.loglineChartData.xData = "寿命"
              this.loglineChartData.yData = "应力"
              this.loglineChartData.title = "疲劳寿命S/N图"
            }else if(this.treelabel === '疲劳裂纹扩展速率'){
              this.loglineChartData.xData = "应力强度因子幅值"
              this.loglineChartData.yData = "疲劳裂纹扩展速率"
              this.loglineChartData.title = "裂纹扩展速率曲线"
            }
            param.paramMap = JSON.stringify(fatigueLife)
            queryLineChartData(param).then(response => {
              this.loglineChartData.data = response.data[0].data
              this.dialogLineEchartsModel = true
            });
        }
      },
      // 线图
      echartsLineBtn2(){
        let line = {
          min: 1,
          max: 1,
        }
        let column = {
          min: 0,
          max: 100,
        }
        if(this.validateData(line,column)){
            let param = {
              ...this.testConditionConfigRequestID,
              performanceTypeName: this.treelabel
              // paramGuid: this.paramGuid,
              // confidencelevel: this.confidenceLevel,
              // survivalrate: this.survivalRate,
              // evaluationmethod: this.evaluationMethod
            }
            let paramMap1 = {
              params : this.paramData
            }
            let newList = Object.assign({}, this.multipleSelection[0]);
            this.resultDataCollFixed.map(item=>{
              if(item != "materialtypename"){
                delete newList[item]
              }
            })
            delete newList["rowguid"]
            let resultMap1 = {
              result : newList
            }
            let fatigueLife = {
              ...paramMap1,
              ...resultMap1
            }
            if(this.treelabel === '静力学性能'){
              this.loglineChartData.xData = "工程应变"
              this.loglineChartData.yData = "工程应力"
              this.loglineChartData.title = "静力拉伸曲线"
            }
            param.paramMap = JSON.stringify(fatigueLife)
            queryLineChartData(param).then(response => {
              this.loglineChartData.data = response.data[0].data
              this.dialogLineEchartsModel2 = true
            });
        }
      },
      handleOpenSn() {
        this.$nextTick(() => {
          this.$refs.snchart.initChart()
        });
      },
      handleOpenSn2() {
        this.$nextTick(() => {
          this.$refs.snchart2.initChart()
        });
      },
      handleOpenBar() {
        this.$nextTick(() => {
          this.$refs.barchart.initChart()
        });
      },
      handleOpenRaddar() {
        this.$nextTick(() => {
          this.$refs.raddarchart.initChart()
        });
      }
    },
  };
</script>
<style scoped lang="scss">
  @import "@/assets/styles/container.scss";
  // 表格显示区域
  .right-container-top-table {
    width: 100%;
    float: left;
  }

  .right-container-top-left-table {
    width: 54%;
    float: left;
  }

  .right-container-top-right-table {
    width: 44%;
    margin-left: 2%;
    float: left;
  }

  .table-title {
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    height: 26px;
    color: #5184ec;
    border-bottom: 1px solid #d5d5d5;
    background: url("../../../assets/images/line.png") no-repeat;
    background-position: -110px 22px;
  }

  // 表格下方按钮
  .right-container-top-option {
    width: 100%;
    padding-top: 13px;
    position: relative;
    float: left;
  }

  .option-input {
    float: left;
    margin-top: 5px;

    .option-input-text {
      float: left;
      font-size: 14px;
      line-height: 36px;
    }
  }

  .option-buttons {
    float: right;
  }

  .bottom-button {
    bottom: 55px;
  }

  // 按钮自定义
  .buttons {
    width: 140px;
    height: 35px;
    font-size: 15px;
    // border-style: dashed;
  }

  // .buttons-del {
  //   &:hover {
  //     color: #ff4949;
  //     background: #ffcfcf;
  //   }
  //   &:focus {
  //     color: #ff4949;
  //     background: #ffcfcf;
  //   }
  // }
  // .buttons-files {
  //   &:hover {
  //     color: #1890ff;
  //     background: #add8ff;
  //   }
  //   &:focus {
  //     color: #1890ff;
  //     background: #add8ff;
  //   }
  // }

  ::v-deep .icon-files {
    width: 20px;
    height: 24px;
    background: url("../../../assets/images/files.png") center no-repeat;
    background-size: 90%;
    margin-right: 13px;
  }

  ::v-deep .icon-files:before {
    content: "提";
    visibility: hidden;
  }



  .app-container{
    padding: 5px;
  }
  .home .right-container{
    margin-left: 5px;
  }
  .home .right-container .right-container-bottom{
    margin-top: 5px;
    padding: 5px 20px 13px 20px;
    width: 99.5%;
  }
  .home .right-container .right-container-top{
    min-height: 150px;
    padding: 5px 20px 5px 20px;
    width: 99.5%;
  }

  ::v-deep .checkboxTitle.el-checkbox{
    display: inline-block;
    width: 100% !important;
    .el-checkbox__label{
      width: 80% !important;
      white-space: nowrap !important;
      text-overflow: ellipsis !important;
      overflow: hidden !important;
      position: relative;
      top: 5px;
    }
  }
</style>
